<template>
  <div id="scroll-board">
    <i class="bottomL"></i>
    <i class="bottomR"></i>
    <div class="title_style">
      <div style="width: 3px;height: 20px;background-color: #E68D22;margin-right: 10px;margin-top: 10px">
      </div>
      <div>
        负面舆情
      </div>
    </div>
    <dv-scroll-board :config="config" class="box_style" v-on:click="clickHandler"/>
  </div>
</template>

<script>
  import {getNegativePublicOpinion,} from "@/api/system/opinion";
  import {formatDate} from "../../../utils";

  export default {
    name: 'TopRightTable',
    data() {
      return {
        // 查询参数
        config: {},
        // 查询参数
        queryParams: {
          count: 20
        },
      }
    },
    computed: {},
    watch: {},
    created() {
      this.getNegativePublicOpinion();
    }, methods: {
    /** 查询文章管理列表 */
    getNegativePublicOpinion() {
      getNegativePublicOpinion(this.queryParams).then(response => {
        this.opinionList = response.data;
        let obj = {
          // header: ['标题', '时间'],
          data: [],
          index: true,
          columnWidth: [30, 360, 160],
          align: ['center'],
          rowNum: 10,
          headerBGC: '#1981f6',
          headerHeight: 45,
          oddRowBGC: 'rgba(0, 44, 81, 0.8)',
          evenRowBGC: 'rgba(10, 29, 50, 0.8)'
        }

        for (let i = 0; i < this.opinionList.length; i++) {
          let blogInfo = this.opinionList[i];
          let array = []
          array.push(blogInfo.title)
          let d = formatDate(blogInfo.publishTime)
          array.push(d)
          obj.data.push(array)
        }
        ;
        this.config = obj
      })
    } },

  }
</script>

<style lang="less" scoped>
  #scroll-board {
    width: 100%;
    background-color: rgba(6, 30, 93, 0.5);
    height: 100%;
    position: relative;
  }


  .title_style {
    display: flex;
    color: #00CCFF;
    font-weight: bold;
    padding-left: 10px;
    line-height: 40px;
    width: 100%;
    height: 40px;
    background-size: 100% 100%;
    background-image: url("./../../../assets/images/datav/title_bg.png");
  }

  .bottomL {
    width: 20px;
    height: 20px;
    border-bottom-width: 2px;
    border-bottom-color: #26c6f0;
    border-bottom-style: solid;
    border-left-width: 2px;
    border-left-color: #26c6f0;
    border-left-style: solid;
    position: absolute;
    bottom: -2px;
    left: -2px
  }

  .bottomR {
    width: 20px;
    height: 20px;
    border-bottom-width: 2px;
    border-bottom-color: #26c6f0;
    border-bottom-style: solid;
    border-right-width: 2px;
    border-right-color: #26c6f0;
    border-right-style: solid;
    position: absolute;
    bottom: -2px;
    right: -2px
  }

  .box_style {
    cursor: pointer;
    width: 100%;
    height: calc(~"100% - 40px");;
  }
</style>
